<template>
  <a-spin :spinning="confirmLoading">
       <j-form-container >
        <a-form-model ref="form" :model="model"  slot="detail">
          <a-row>
            <a-col :span="24">
              <a-form-model-item label="Payment method" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="paymentMethod">
                <j-dict-select-tag type="list" v-model="model.paymentMethod" :disabled="true"  dictCode="paymentMethod" placeholder="" />
              </a-form-model-item>

            </a-col>
            <a-col :span="24">
              <a-form-model-item :wrapper-col="{ span: 14, offset: 10 }">
                <a-button type="primary" @click="handleInvoicePdf">
                  Download PDF
                </a-button>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </j-form-container>

  </a-spin>
</template>

<script>


import {httpAction, getAction, downFile} from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import '@/assets/less/TableExpand.less'
  import { mixinDevice } from '@/utils/mixin'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import PageLayout from '@/components/page/PageLayout'
  import STable from '@/components/table/'
  import DetailList from '@/components/tools/DetailList'
  import ABadge from "ant-design-vue/es/badge/Badge"
  const DetailListItem = DetailList.Item

  export default {
    name: 'InvoiceDownPdfForm',
    mixins:[JeecgListMixin, mixinDevice],
    components: {
      PageLayout,
      ABadge,
      DetailList,
      DetailListItem,
      STable
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        disableMixinCreated:true,
        studentId:0,
        isEdit:false,
        model:{

         },
        validatorRules: {
          paymentMethod: [
            { required: true, message: 'Please select Payment Method!'},
          ]
        },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 7 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 14 },
        },
        confirmLoading: false,
        url: {
          sendEmail: "/sistersophie/invoiceInfo/sendEmail",
          downLoadPdf: "/sistersophie/invoiceInfo/downloadPdf"
        }
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      handleInvoicePdf(){
        let fileName = "invoice-" + this.model.id;
        let param = {};
        param.id = this.model.id;
        param.paymentMethod = this.model.paymentMethod;
        downFile(this.url.downLoadPdf,param).then((data)=>{
          if (!data) {
            this.$message.warning("文件下载失败")
            return
          }
          if (typeof window.navigator.msSaveBlob !== 'undefined') {
            window.navigator.msSaveBlob(new Blob([data],{type: 'application/pdf'}), fileName+'.pdf')
          }else{
            let url = window.URL.createObjectURL(new Blob([data],{type: 'application/pdf'}))
            let link = document.createElement('a')
            link.style.display = 'none'
            link.href = url
            link.setAttribute('download', fileName+'.pdf')
            document.body.appendChild(link)
            link.click()
            document.body.removeChild(link); //下载完成移除元素
            window.URL.revokeObjectURL(url); //释放掉blob对象
          }
        })
      },
      add () {
        this.isEdit = false;
        this.model = Object.assign({}, this.modelDefault);
        this.visible = true;
      },
      edit (record) {
        this.isEdit = true;
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      submitForm () {
        const that = this;
        // 触发表单验证
      },
    }
  }
</script>
<style lang="less" scoped>
.title {
  color: rgba(0,0,0,.85);
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 16px;
}
</style>